<template>
  <div class="op-container">
    <div class="Related_container">
      <div class="currency_box">
        <p>平台币 = </p>
        <el-input v-model="input" :readonly="!authorityHandle(159)" placeholder="" />
        <p>元宝</p>
      </div>
    </div>
    <div class="footer">
      <button v-if="authorityHandle(159)" class="btnStyle" @click="setCurrency">保存</button>
    </div>
  </div>
</template>

<script>
import { getCurrency, setCurrency } from '@/api/settings/settings'
export default {
  components: {},
  data() {
    return {
      input: ''
    }
  },
  created() {
    this.getCurrency()
  },
  methods: {
    getCurrency() {
      getCurrency().then(res => {
        this.$log(res)
        if (res.data.data === null) return
        this.input = res.data
      })
    },
    setCurrency(e) {
      const target = e.target
      target.blur()
      setCurrency({ 'data': this.input }).then(res => {
        this.$message.success('保存成功')
      })
    }
  }
}
</script>
<style lang="scss" scoped>
$menuText:#14162E; // 侧边栏字体颜色
$hoverColor:#1D143C;// 鼠标停留主色调浅色
$mainColor:#3b425d;// 主色调
.op-container{
  margin: 20px;
  .Related_container {
    width: 900px;
    height: 500px;
    padding: 60px 0;
    border-radius: 10px;
    border: 1px dashed #ccc;
    margin: 50px auto 0;
    .el-input__inner:focus {
      border-color: #3b425d
    }
    .currency_box {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;

      .el-input {
        width: 150px;
        height: 40px;
        margin: 0 20px;

        input {
          width: 100%;
          height: 100%;
        }
      }
    }
  }
  .footer {
    text-align: center;
    margin-top: 30px;
  }
}
</style>
